<template>
  <!-- 账号编辑日志 -->
  <a-modal
    v-model:open="visible"
    title="账号编辑日志"
    class="addStation"
    destroyOnClose
    :width="900"
    @cancel="cancel"
    :footer="null"
    centered
  >
  <div class="tableContent">
    <a-table
      :dataSource="tableData"
      :columns="columns"
      size="small"
      :scroll="{ x: 'max-content' }"
      @resizeColumn="handleResizeColumn"
      :pagination="false"
      :loading="tableLoading"
    >
      <template #bodyCell="{ column, record }"> </template>
    </a-table>
    <a-pagination
      v-model:current="filterForm.current"
      v-model:page-size="filterForm.size"
      :total="total"
      position="bottomRight"
      show-size-changer
      @change="getLogPage"
      :show-total="(total) => `总共 ${total} 条`"
    >
      <template #buildOptionText="props">
        <span>{{ props.value }}条/页</span>
      </template>
    </a-pagination>
  </div>
  </a-modal>
</template>
<script setup>


const $api = inject("$api");
const props = defineProps({
  userLogVisible: {
    type: Boolean,
    default: false,
  },
  rowData: {
    type: Object,
  },
});
const loading = ref(false);
const visible = ref(props.resetPassWordVisible);
const emits = defineEmits(["update:userLogVisible"]);
watch(
  () => props.userLogVisible,
  (val) => {
    getLogPage();
    visible.value = val;
  }
);
const filterForm = ref({
  size: 10,
  current: 1,
});
const total = ref();
const tableData = ref([]);
const columns = ref([
  {
    title: "操作人",
    dataIndex: "createUserName",
    key: "createUserName",
    width: 180,
    resizable: true,
    align: "center",
  },
  {
    title: "操作时间",
    dataIndex: "createTime",
    key: "createTime",
    width: 200,
    resizable: true,
    align: "center",
  },
  {
    title: "操作描述",
    dataIndex: "title",
    key: "title",
    resizable: true,
    align: "center",
    width: 400,
  },
]);
const cancel = () => {
  emits("update:userLogVisible", false);
};
const getLogPage = async () => {
  const params = {
    current: filterForm.value.current,
    size: filterForm.value.size,
  }
  const res = await $api.logPage(params);
  if (res && res.code === 0) {
    tableData.value = res.data.records;
    total.value = res.data.total;
  }
}
</script>

<style lang="less" scoped>
.tableContent {
  border-radius: 4px;
  background-color: #141414;
  padding: 8px;
  margin-top: 20px;
}
.footerBar {
  text-align: center;
  margin-top: 30px;
}
</style>